import router from './router'
import store from './store'
// 白名单
const whiteList = ['/login', '/404', 'abc']

router.beforeEach(async (to, from, next) => {
  const token = store.getters.token
  if (token) {
    if (to.path === '/login') {
      next('/')
    } else {
      // 不是登录页,正常通行
      if (store.getters.userId) {
        // 用户信息已经存在
        next()
      } else {
        // 用户信息尚未存在,需要首次获取
        // 获取用户的资料信息:用户的权限信息:menus;points(触发action完成)
        // 这里必须手动再次电泳如下的getInfo方法,需要确保获取用户信息后,才可以获取menus权限
        await store.dispatch('user/getInfo')
        // filterDynamicRoutes 负责根据用户的权限过滤动态路由，与静态路由合并放到vuex的状态里面
        // 然后返回动态路由，用于添加动态路由
        const myAuth = await store.dispatch('permission/filterDynamicRoutes')
        // 基于vue-router的API动态添加路由映射
        router.addRoutes([...myAuth, { path: '*', redirect: '/404', hidden: true }])
        next({
          ...to,
          // 如果添加了动态路由，那么路由会重新请求一次，这样会导致同一个路由链接被请求两次
          // 那么浏览器回退会多出一个历史记录，体验不好，所以可以使用replace属性覆盖第一次请求。
          replace: true
        })
      }
    }
  } else {
    if (whiteList.includes(to.path)) {
      next()
    } else {
      router.push('/login')
    }
  }
})
